/**
 * 消息列表
 * @author levy
 */
import PullRefresh from '../components/mui/PullRefresh';
//let proxy = new Proxy({},{
//	get(){
//		console.log('Proxy test');
//	}
//});

(function( lf, r) {
    var time = lf.utils.format(new Date(),"MM-dd hh:mm");
    var ajax = lf.utils.ajax,
        log = lf.utils.log,
        bridgeJs = lf.bridgeJs,
        doAction = bridgeJs.doAction,
        RC = r.createClass;

    var data = [
    ];

    var Msg = React.createClass({
        componentDidMount:function(){
             r.findDOMNode(this.refs.clickNode).addEventListener('tap', this.fn, !1);
        },
        fn: function () {
            var msg = this.props.data;
            doAction('msg-detail.html', msg.from)
        },
        render(){
            var msg = this.props.data;
            return (
                <li className="mui-table-view-cell">
                    <a ref="clickNode" href="javascript:;">
                        <span className={msg.from == '系统消息'? "green font48 left-top" : " font48 left-top"} >{msg.from}</span>
                        <span className="font36 right-top">{msg.time}</span>
                        <span className="font36 left-bottom">{msg.title}</span>
                    </a>
                </li>
            );
        }
    });
	var MsgCon = React.createClass({
        getInitialState:function(){
            return {
                msgList:[],
                mock:[
                    {
                        from:'系统消息',
                        time:time,
                        title:'请制定学习计划',
                        url:'http://test.liefengtech.com/zhwy-hybrid/html/msg-detail.html'

                    },
                    {
                        from:'王伟',
                        time:time,
                        title:'请制定学习计划',
                        url:'http://test.liefengtech.com/zhwy-hybrid/html/msg-detail.html'

                    }
                ]
            };
        },
        componentWillMount:function(){
            //ajax({
            //    data: {
            //        currentPage: 1,
            //        pageSize: 15
            //    }
            //}, 'msg', function cb( data ) {
            //    //var msgList = data.map(function( item ){
            //    //    return <Msg data={item}/>
            //    //});
            //    //
            //    //this.setState({
            //    //    msgList: msgList
            //    //});
            //}.bind(this));
            //var msgList = this.state.mock.map(function( item ){
            //    return <Msg data={item}/>
            //});
            //this.setState({
            //    msgList: msgList
            //});
        },
		render: function () {
            return (
                <div className="lf-list">
                    <ul className="mui-table-view">
                        {this.state.msgList }
                    </ul>
                </div>
            );
		}
	});

    var Body = RC({
        _conRender: function () {
            return (
                <MsgCon />
            )
        },
        render: function () {
            return (
                <PullRefresh conRender={this._conRender} />
            )
        }
    });

    r.render(
			<Body />,
			document.getElementById('root')
	)

})( liefeng, React)
